import { Modal, ModalBody, ModalContent, ModalHeader, Image } from "@nextui-org/react";
import AuthPage from "@/app/components/auth/authPgae";
import React from "react";
import { NoteIcon } from "@/app/assets/icons/NoteIcon";

/**
 * 登录和注册的弹窗主体
 * @param isOpen
 * @param onOpenChange
 * @constructor
 */
export default function AuthModal({ isOpen, onOpenChange }: any) {
    return (
        <Modal backdrop={"blur"} isOpen={isOpen} onOpenChange={onOpenChange}
            placement={"auto"}
            size={"lg"}>
            <ModalContent>
                {onClose => (
                    <>
                        {/*头部*/}
                        <ModalHeader className="flex justify-center items-center gap-1 py-6">
                            <div className="flex flex-col items-center">
                                <div className="mb-2 flex items-center">
                                    <NoteIcon className="w-6 h-6" />
                                    <span className="text-2xl ml-2 font-bold text-primary">Me Notes</span>
                                </div>
                                <p className="text-sm text-gray-500">智能笔记，高效生活</p>
                            </div>
                        </ModalHeader>
                        {/*内容*/}
                        <ModalBody className="px-8 py-4 pb-8">
                            <AuthPage isLogin={true} />
                        </ModalBody>
                    </>
                )}
            </ModalContent>
        </Modal>
    )
}